import type { CompanyInfoDto, CompanyProductInfoDto, EleSignInfoDto, ElesignTemplateDto } from '@/api/company/types'
import TableRender, { type TableRenderColumnTypes } from '@/render/TableRender'
import type { AnyObject } from '@/types'
import { Component, Prop } from 'vue-facing-decorator'
import type { VxeColumnSlotTypes, VxeGridPropTypes, VxeTableDataRow } from 'vxe-table'
import toNative from '@/utils/toNative'
import type { FilterDto } from '@/render/FilterRender'
import { downloadFile } from '@/utils/util'
import { exportContractTemplate, getEleContractTemplateList } from '@/api/company'
import renderModal, { getModelValue, type FormModalDto } from '@/components/modal/Modal'
import { updateTemplateAgeLimit } from '@/api/insurance/elesign'
import { Button, message } from 'ant-design-vue'
import dayjs from 'dayjs'

@Component
export class InsuranceRecord extends TableRender {
    @Prop() eleSignInfo!: EleSignInfoDto
    @Prop() companyBasicInfo!: CompanyInfoDto

    noTablePadding = true
    noFilterPadding = true
    filterTheme = 'light'

    showDetail = false
    curItem = {} as ElesignTemplateDto

    curMonthFirstDay = dayjs().startOf('month').format()
    curMonthLastDay = dayjs().endOf('month').format()

    filterConfig() {
        return {
            searchName: {
                name: '搜索',
                element: 'input',
                placeholder: '请输入企业/合同名称'
            },
            userName: {
                name: '创建人',
                element: 'input',
                placeholder: '请输入姓名/身份证号'
            },
            queryTime: {
                name: '创建时间',
                element: 'datetime',
                type: 'date',
                params: {
                    valueFormat: 'YYYY-MM-DD'
                }
            }
        } as FilterDto
    }

    tableColumnConfigOld = () => [
        // { type: 'checkbox', width: 50, fixed: 'left' },
        {
            field: 'templateName',
            title: '合同名称',
            width: 200
        },
        {
            field: 'flowDescription',
            title: '合同描述',
        },
        {
            field: 'userName',
            title: '创建人'
        },
        {
            field: 'effectiveTime',
            title: '合同有效时间',
            width: 140,
            formatter: ({row}) => {
                return row.effectiveTime ? row.effectiveTime + '/年' : '--'
            }
        },
        {
            field: 'createTime',
            title: '创建时间',
            width: 150
        },
        {
            field: 'operate',
            title: '操作',
            params: {
                buttons: [
                    {
                        text: '修改年限',
                        event: (row: ElesignTemplateDto) => this.onShowDialog(row)
                    }
                ]
            },
            slots: {
                default: 'buttons'
            }
        }
    ] as TableRenderColumnTypes<ElesignTemplateDto>

    basicFormConfig = this.initBasicFormConfig() as FormModalDto
    initBasicFormConfig() {
        return {
            title: '修改年限',
            width: '450px',
            theme: 'light',
            show: false,
            items: {
                effectiveTime: {
                    name: '有效年限',
                    element: 'inputNumber',
                    required: true,
                    params: {
                        min: 1
                    }
                }
            },
            complete: async () => {
                const data = getModelValue(this.basicFormConfig)
                data.companyId = this.eleSignInfo.companyId
                data.id = this.curItem.id
                data.unit = this.curItem.unit
                await updateTemplateAgeLimit(data)
                message.success('修改成功')
                this.reloadPage()
                this.basicFormConfig.show = false
            },
            cancel: () => {
                this.basicFormConfig.show = false
            },
            init: async () => {}
        } as FormModalDto
    }

    onShowDialog(row: ElesignTemplateDto) {
        console.log(1234)
        this.curItem = row
        this.basicFormConfig.show = true
    }

    async onExport() {
        const data = this.getFilters()
        const res = await exportContractTemplate({
            companyId: this.eleSignInfo.companyId,
            companyName: this.companyBasicInfo.companyName,
            ...data
        })
        downloadFile(res)
    }

    onLoadData(page: number, size: number, filters: AnyObject) {
        if (!this.eleSignInfo?.companyId) return []
        return getEleContractTemplateList({
            companyId: this.eleSignInfo.companyId,
            pageNum: page,
            pageSize: size,
            ...filters
        })
    }

    renderRightBtns() {
        return (
            <>
                {/* <Button type="primary" onClick={this.onExport}>
                    导出列表
                </Button> */}
            </>
        )
    }

    render() {
        return (
            <>
                {super.render()}
                {renderModal(this.basicFormConfig)}
            </>
        )
    }
}

export default toNative<
    { eleSignInfo: EleSignInfoDto; companyProductInfo: CompanyProductInfoDto },
    { refresh: () => void }
        >(InsuranceRecord)
